<?php
    // estilos -- ver por qué no puedo usar class con un css - otra clase debe estar bloqueandolo
    $tabla_orga_td = 'vertical-align: middle; background-color: ; border: none;';    

    // imagenes
    $prev_img = $this->Html->image("restaurante/ic_navegar_left.png", array("width" => "32px", "height" => "32px", "id" => "nav_icon_left"));    
    $next_img = $this->Html->image("restaurante/ic_navegar.png", array("width" => "32px", "height" => "32px", "id" => "nav_icon_right"));    
    $prev_img_disabled = $this->Html->image("restaurante/ic_nav_left_disabled.png", array("width" => "32px", "height" => "32px", "id" => "nav_icon_left_disabled"));    
    $next_img_disabled = $this->Html->image("restaurante/ic_navegar_disabled.png", array("width" => "32px", "height" => "32px", "id" => "nav_icon_right_disabled"));    


    $volver_img = $this->Html->image("restaurante/ic_close.png", array("id" => "back_icon"));    
    $nuevo_img = $this->Html->image("restaurante/ic_add.png", array("id" => "add_icon"));    
    $cancel_img = $this->Html->image("restaurante/ic_cancel.png", array("id" => "back_icon"));    
    $save_img = $this->Html->image("restaurante/ic_ok.png", array("id" => "save_icon"));    
    
    $editar_img = $this->Html->image("restaurante/doc_images.png", array("width" => "24px", "height" => "24px"));    
    
?>

<?php   $desc_estado = array(0 => 'Libre', 1 => 'Abierta', 2 => 'Reservada', 3 => 'Deshabilitada'); 
        $color_estado = array(0 => 'PaleGreen', 1 => '#F78181', 2 => 'SteelBlue', -1 => 'beige', 3 => 'gray'); 
?>

<!--- MARCO DE LA PANTALLA ------>
<table><tr><td style="width: 10%; border: none;"></td>
        <td style="padding: 20px; background: white;<?php echo $tabla_orga_td;?>">

<table>
    <tr>
        <td style="width: 15%; text-align:right; <?php echo $tabla_orga_td;?>"><div><?php echo $this->Html->image("restaurante/ic_resto.png", array("id" => "resto_icon"));?></div></td>
        <td style="width: 55%; text-align:left; <?php echo $tabla_orga_td;?>"><h1 class="titulo_ventana_2">Editar mesa</h1></td>
        <td style="width: 30%; text-align:right; <?php echo $tabla_orga_td;?>">
            <table>
                <tr><td style="text-align:right; <?php echo $tabla_orga_td;?>"><?php echo 'Usuario: '.$nombre_usuario;?></td></tr>
                <tr><td style="text-align:right; <?php echo $tabla_orga_td;?>"><?php echo $this->Html->link('Cerrar sesión', array("controller"=>"users", "action"=>"logout"), array('title' => 'Cerrar sesión', 'escape' => false));?></td></tr>
            </table>
        </td>
    </tr>      
</table>
<hr>

<?php
    echo $this->Form->create('Mesa');
?>

<!--- CONTROLES ------>
<table style="<?php echo $tabla_orga_td;?>">
    <tr style="<?php echo $tabla_orga_td;?>">
        <td style="width:30%; <?php echo $tabla_orga_td;?>"><?php echo $this->Form->input('codigo', array('label' => 'Mesa Nro.', 'readonly' => 'readonly')); ?></td>
        <td style="width:70%; <?php echo $tabla_orga_td;?>" colspan="2"></td>
    </tr>
    <tr style="<?php echo $tabla_orga_td;?>">
        <td style="width:30%; <?php echo $tabla_orga_td;?>"><?php echo $this->Form->input('pos_x', array('label' => 'Pos. Horizontal', 'readonly' => 'readonly')); ?></td>
        <td style="width:30%; <?php echo $tabla_orga_td;?>"><?php echo $this->Form->input('pos_y', array('label' => 'Pos. Vertical', 'readonly' => 'readonly')); ?></td>
        <td style="width:40%; <?php echo $tabla_orga_td;?>"></td>
    </tr>
</table>

<!--- MESAS UBICACIONES ---> 
<table>
<tr>
    <td style="border: none;width: 80%;">
        <table>
        <?php 
            $ancho = floor(100.0 / ($max_pos_x + 1));
            echo '<tr>';
            echo '<td style="'.$tabla_orga_td.'text-align:center; height: 20px; width: '.$ancho
                    .'%; background-color: transparent;"></td>';
            for($j = 1; $j <= $max_pos_x; $j++) {
                echo '<td style="'.$tabla_orga_td.'text-align:center; height: 20px; width: '.$ancho
                    .'%; background-color: transparent;">'.$j.'</td>';                
            }
            for($i = 1; $i <= $max_pos_y; $i++) {
                echo '<tr>';
                echo '<td style="'.$tabla_orga_td.'text-align:center; height: 20px; width: '.$ancho
                    .'%; background-color: transparent;">'.$i.'</td>';
                for($j = 1; $j <= $max_pos_x; $j++) {
                    if (isset($m_codigo[$i][$j])) {
                        // hay una mesa asignada en esta ubicación
                        echo '<td id="celda_'.$i.'_'.$j.'" style="'.$tabla_orga_td.'text-align:center; height: 20px; width: '.$ancho
                                .'%; background-color:'.$color_estado[$m_estado[$i][$j]].';"'
//                                .' onclick="alert();">'.$m_codigo[$i][$j].'</td>';
                                .' onclick="cambiarPosMesa('.$i.','.$j.','.$max_pos_x.','.$max_pos_y.');">'.$m_codigo[$i][$j].'</td>';
                    } else {
                        // no hay una mesa asignada en esta ubicación
                        echo '<td id="celda_'.$i.'_'.$j.'" style="'.$tabla_orga_td.'text-align:center; height: 20px; width: '.$ancho
                                .'%; background-color:'.$color_estado[-1].';"'
//                                .' onclick="alert();"></td>';
                                .' onclick="cambiarPosMesa('.$i.','.$j.','.$max_pos_x.','.$max_pos_y.');"></td>';
                    }
                }
                echo '</tr>';
            }    
        ?>
        </table>
    </td>
<!--- LEYENDAS ESTADOS --->             
    <td style="border: none;width: 20%;">
        <table>
        <?php    
            echo '<tr>';
            echo '<td style="'.$tabla_orga_td.'height:10px;width:15px;background-color:'.$color_estado[0].'";></td>';
            echo '<td>'.$desc_estado[0].'</td>'; 
            echo '</tr>';

            echo '<tr>';
            echo '<td style="'.$tabla_orga_td.'height:10px;width:15px;background-color:'.$color_estado[1].'";></td>';
            echo '<td>'.$desc_estado[1].'</td>'; 
            echo '</tr>';

            echo '<tr>';
            echo '<td style="'.$tabla_orga_td.'height:10px;width:15px;background-color:'.$color_estado[2].'";></td>';
            echo '<td>'.$desc_estado[2].'</td>'; 
            echo '</tr>';         

            echo '<tr>';
            echo '<td style="'.$tabla_orga_td.'height:10px;width:15px;background-color:'.$color_estado[3].'";></td>';
            echo '<td>'.$desc_estado[3].'</td>'; 
            echo '</tr>';         
        ?>
        </table>
    </td>
</tr>
</table>

<!--- BOTONERA ------>
<table>
    <tr>
        <td style="width: 10%; text-align:right; <?php echo $tabla_orga_td;?>"><?php echo 'Cancelar'; ?></td>
        <td style="width: 10%; text-align:left; <?php echo $tabla_orga_td;?>"><?php echo $this->Html->link($cancel_img, array("controller"=>"mesas", "action"=>"index"), array('class' => 'button', 'title' => 'Cancelar', 'escape' => false));?></td>
        <td style="width: 60%; <?php echo $tabla_orga_td;?>"></td>
        <td style="width: 10%; text-align:right; <?php echo $tabla_orga_td;?>"><?php echo 'Guardar'; ?></td>
        <td style="width: 10%; text-align:left; <?php echo $tabla_orga_td;?>"><?php echo $this->Form->submit('restaurante/ic_ok.png', array('style' => 'width:inherit;')); ?> </td>
    </tr>
</table>

<?php echo $this->Form->end(); ?>

<!--- FIN MARCO DE LA PANTALLA ------>
</td><td style="width: 10%; border: none;"></tr></table>
